import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom'
import LoginPage from './components/LoginPage'
import CirclesPage from './components/CirclesPage'
import CircleDetailPage from './components/CircleDetailPage'
import './App.css'

function App() {
  // 检查用户是否已登录
  const isLoggedIn = () => {
    return localStorage.getItem('user') !== null
  }

  return (
    <Router>
      <div className="App">
        <Routes>
          <Route path="/login" element={<LoginPage />} />
          <Route 
            path="/circles" 
            element={isLoggedIn() ? <CirclesPage /> : <Navigate to="/login" replace />} 
          />
          <Route 
            path="/circle/:circleId" 
            element={isLoggedIn() ? <CircleDetailPage /> : <Navigate to="/login" replace />} 
          />
          <Route 
            path="/" 
            element={<Navigate to={isLoggedIn() ? "/circles" : "/login"} replace />} 
          />
        </Routes>
      </div>
    </Router>
  )
}

export default App

